<template>
  <div>
    <div style="margin-bottom: 40px">
      <manager-header></manager-header>
    </div>

    <div class="content" style="width: 1600px">
      <div class="content" style="width: 200px">
        <manager-navigation></manager-navigation>
        <manage-container></manage-container>
      </div>
      <div>
        <el-table
          :data="Permissions"
          style="width: 1000px"
          border>
          <el-table-column
            prop="permissionName"
            label="权限名">
          </el-table-column>

          <el-table-column
            label="操作"
            width="250px">
            <template slot-scope="scope">
              <el-button
                size="mini"
                @click="findArticleById(scope.row.articleId)">查看
              </el-button>
              <el-button
                size="mini"
                @click="editArticle(scope.row.articleId)">编辑
              </el-button>
              <el-button
                size="mini"
                type="danger"
                @click="handleDelete(scope.$index, scope.row)">删除
              </el-button>
            </template>
          </el-table-column>

        </el-table>
      </div>
    </div>
  </div>
</template>

<script>
  import {SystemManageService} from '../SystemManageService'
  import managerNavigation from '../../../components/systemManage/ManageNavigation'
  import managerHeader from '../../../components/systemManage/ManageHeader'
  import manageContainer from '../../../components/systemManage/ManageContainer'
  import router from '../../../router'
  export default {
    name: "PermissionList",
    components: {
      managerNavigation: managerNavigation,
      managerHeader: managerHeader,
      manageContainer: manageContainer,
    },

    data() {
      return {
        Permissions: []
      }
    },
    mounted: function () {
      this.findAllPermissions()
    },
    methods: {
      findAllPermissions() {
        SystemManageService.findAllPermissions().then(res => {
          this.Permissions = res.data;
          console.log(this.Permissions)
        })
      },
      findArticleById(articleId) {

      },
      editArticle(articleId){

      }
    }
  }
</script>

<style scoped>
  .content {
    display: flex;
    justify-content: space-between;
  }
</style>

